<!--
 * @description  : 内管实地核查动态组件
 * @descriptionDetail: 内管实地核查动态组件
 * @copyright    : 浙江烟草
 * @author       : lcm
 * @create       : 2022-09-27 09:58:58
-->

<template>
  <view>
    <u-form-item
      :label-width="calcWidth()"
      :labelAlign="labelAlign"
      :labelPosition="computeLabelPos(itemData.component)"
      :label="itemData.label"
      :prop="itemData.propName"
      :required="itemData.required"
      :label-style="labelStyle"
      :class="itemData.component === 'u-switch' ? 'dynamic-switch' : ''"
    >
      <component
        :is="itemData.component"
        v-model="itemData.value"
        :placeholder="itemData.placeholder || ''"
        v-bind="itemData.attrs || {}"
        :disabled="disabled"
        @change="handleCompChange($event, itemData.propName)"
        @input="handleCompChange($event, itemData.propName)"
      ></component>
    </u-form-item>
    <template v-if="itemData.children && itemData.children.length > 0">
      <view v-show="(itemData.defaultValue=='0'?itemData.value :!itemData.value)||(!itemData.readStatus&&itemData.readStatus!=undefined)">
        <dynamic-comp-item
          v-for="sItem in itemData.children"
          :key="sItem.propName"
          :disabled="disabled"
          :itemSource="sItem"
          @update="$emit('update', itemData)"
        ></dynamic-comp-item>
      </view>
    </template>
    <view v-if="((itemData.defaultValue=='0'?itemData.value :!itemData.value ||typeof itemData.value=='string')||(!itemData.readStatus&&itemData.readStatus!=undefined))&& itemData.isUpload && bizUuid">
      <upload-images
        :url="uploadFile"
        :length="10"
        :extForm="{fiGroupCode: 'zmng-images', bizId: bizUuid + '-' + itemData.propName}"
        :del-url="delUrl"
        :can-add="!disabled"
        :can-del="!disabled"
        :renderImages="renderImages"
      >
      </upload-images>
    </view>
  </view>
</template>
<script>
import {ZDictSelect,ZDictRadio, ZDictCheckbox, ZAreaSelect, ZUserSelect,
  ZOrgSelect,ZCarKeyboard,ZCredKeyboard,ZNumKeyboard,ZDate,UploadImages,} from '@/components'
import uSwitch from '@/uview-ui/components/u-switch/u-switch.vue';
import uInput from '@/uview-ui/components/u-input/u-input.vue'
import commonService from '@/service/internal/common.service';
let ScreenWidth = uni.getSystemInfoSync().screenWidth;
export default {
  name: "DynamicCompItem",
  components: { ZDictSelect, ZDictRadio, ZDictCheckbox, ZAreaSelect,ZOrgSelect,
    ZCarKeyboard,ZCredKeyboard,ZNumKeyboard,ZDate,ZUserSelect,UploadImages,
    uSwitch, uInput,
  },
  props: {
    itemSource: {
      type: Object,
      default: () => ({}),
    },
    bizUuid: {
      type: String,
      default: "",
    },
    disabled: {   // 是否不可修改
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      errorType: ['border-bottom','message',],
      labelPosition: 'left',
      labelWidth: uni.getSystemInfoSync().screenWidth - 40,
      labelAlign: "left",
      itemData: {},
      labelStyle: {
        color: "#666",
        fontWeight: '600',
      },
      uploadFile: commonService.uploadFile,
      delUrl: commonService.deleteFile,
    };
  },
  computed: {
    computeLabelPos() {
      return (cType) => cType === 'u-switch' ? "left" : "top"
    },
  },
  watch: {
    itemSource: {
      immediate: true,
      handler(v) {
        this.itemData = v;
      },
    },
  },
  methods: {
    calcWidth() {
      if (this.itemData.component === 'u-switch') {
        return ScreenWidth - 40;
      } else {
        return this.itemData.label ? 60 : 0;
      }
    },

    deepSetModel(arr) {
      if (Array.isArray(arr)) {
        arr.forEach(v => {
          this.$set(this.itemData, v.propName, v.value);
          if (v.children && v.children.length > 0) {
            this.deepSetModel(v.children);
          }
        });
      }
    },
    // 监听switch
    handleCompChange(isChecked, pn) {
      if (this.itemData.children && this.itemData.children.length > 0) {
        this.itemData.children.forEach(v => {
          // this.itemData[v.propName] = isChecked ? this.itemData.label : "";
          if(v.childDefaultVal == '0'){
            v.value = isChecked ?  this.itemData.label + ":" : "";
          }else{
            v.value = isChecked ?  "" : this.itemData.label + ":";
          }
        });
      }
      // 触发值变化
      this.$emit("update", this.itemData);
    },
    renderImages(){
      return commonService.findFilesByBizId(this.bizUuid + '-' + this.itemData.propName).then(r => {
        r.data.forEach(i => {
          i.src = `${commonService.downloadFile}?fileId=${i.gfiId}&tk=${uni.getStorageSync("tk")}`;
          i.filePath = i.src;
        });
        return r.data;
      });
    },
  },
};
</script>
<style lang="scss" scoped>
/deep/ .dynamic-switch .u-form-item--left {
  width: auto !important;
  flex: 1 !important;
}
/deep/ .dynamic-switch .u-form-item--right {
  width: 50px !important;
  flex: none !important;
  -webkit-box-flex: none !important;
  -webkit-flex: none !important;
}
</style>
